Responsive Design (响应式设计)：
建立一个网页，通过CSS Media Queries，Content－Based Breakpoint（基于内容的断点）等技术来改变网页的大小以适应不同分辨率的屏幕。
Adaptive Design (自适应设计)：
为不同类别的设备建立不同的网页，检测到设备分辨率大小后调用相应的网页。目前AD网页主要针对这几种分辨率（320，480，760，960，1200，1600）
时常混淆于这两个概念，同时看到腾讯前端团队的错误自适应与响应式设计,两个名词释义完全相反了吧。。
响应式设计的要素
响应式设计包含三个重要的方面。
媒体查询：是一种CSS语法，可以根据浏览器的特性，一般是屏幕或浏览器容器宽度提供CSS规则；
流式布局：是使用em或百分比等相对单位设定页面总体宽度，让布局能够随屏幕大小而缩放；
弹性图片：是使用相对单位确保图片再大也不会超过其容器。
（这几个方面最早是由Ethan Marcotte提出来的，发表在2010年5月份的AList Apart杂志上）
自适应网页设计也是响应式网页设计，响应式网页设计也是自适应网页设计。
但是真正的细分起来，自适应只是响应式的一个子集，指网页中整体大图的自适应或者banner的自适应。
响应式网页设计优势：
流体网格的网站适合响应式网页设计。
灵活性强，可以适应不同分辨率的设备
方便快捷的解决多设备显示适应问题
自适应网页设计优势：
固定断点的网站适合自适应网页设计。
实施起来代价更低，测试更容易
自适应布局可以让设计更加可控，因为它只需要考虑几种状态就可以了
参考资料：《CSS 设计指南》, 知乎